import React, { Component } from "react";
import { openWebView } from "@tools/native/navigate";
import "./index.scss";

/**
 * 公共活动弹窗
 */
class ActivityModal extends Component {
	constructor(props) {
		super(props);
		this.state = {};
	}
	handleLink = item => {
		if (item.url) {
			if (item.target == "0") {
				this.props.history.push(item.url);
			} else if (item.target == "1") {
				openWebView({ url: item.url });
			} else if (item.target == "2") {
				this.props.history.push({
					pathname: "/iframeAgreements",
					state: {
						src: item.url,
						title: ""
					}
				});
			}
		} else if (this.props.onCloseAcitve) {
			this.props.onCloseAcitve();
		}
	};
	render() {
		const {
			activeVisible,
			onCloseAcitve,
			activeData = {},
			buttonArray,
			btnStyles = {},
			btnContStyles = {}
		} = this.props;
		return (
			<div>
				{activeVisible && (
					<div className="active-modal">
						<div className="active-modal-bg"></div>
						<div className="active-modal-content">
							<div className="modal-content-detail">
								<div className="close" onClick={onCloseAcitve}></div>
								<div>
									<img src={activeData.popupImgUrl} />
								</div>
								<div className="btns-content" style={btnContStyles}>
									{buttonArray && buttonArray.length > 0
										? buttonArray.map(item => (
											<span
												style={btnStyles}
												className={item.url ? "primary" : ""}
												key={Math.random()}
												onClick={() => this.handleLink(item)}
											>
												{item.btnDesc}
											</span>
										))
										: ""}
								</div>
							</div>
						</div>
					</div>
				)}
			</div>
		);
	}
}

export default ActivityModal;
